<template>
  <div class="home">
    <h1 class="text-2xl font-bold mb-6">PDF 处理工具</h1>
    
    <div class="grid grid-cols-2 gap-6">
      <!-- PDF处理卡片 -->
      <a-card class="hover:shadow-lg transition-shadow">
        <template #title>PDF 处理</template>
        <template #extra>
          <router-link to="/pdf" class="text-blue-500">进入 →</router-link>
        </template>
        <div class="space-y-2">
          <p>• PDF文件合并</p>
          <p>• PDF转Excel</p>
          <p>• 批量处理</p>
        </div>
      </a-card>

      <!-- AI聊天卡片 -->
      <a-card class="hover:shadow-lg transition-shadow">
        <template #title>AI 助手</template>
        <template #extra>
          <router-link to="/chat" class="text-blue-500">进入 →</router-link>
        </template>
        <div class="space-y-2">
          <p>• PDF智能问答</p>
          <p>• 图文理解</p>
          <p>• 语音交互</p>
        </div>
      </a-card>
    </div>

    <!-- 最近任务列表 -->
    <div class="mt-8">
      <h2 class="text-xl font-medium mb-4">最近任务</h2>
      <a-table :columns="columns" :data="recentTasks" :pagination="false">
        <template #status="{ record }">
          <a-tag :color="getStatusColor(record.status)">
            {{ record.status }}
          </a-tag>
        </template>
      </a-table>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useAppStore } from '../store'

const store = useAppStore()
const recentTasks = ref([])

const columns = [
  {
    title: '任务名称',
    dataIndex: 'name'
  },
  {
    title: '类型',
    dataIndex: 'type'
  },
  {
    title: '状态',
    dataIndex: 'status',
    slots: { customRender: 'status' }
  },
  {
    title: '创建时间',
    dataIndex: 'createdAt'
  }
]

const getStatusColor = (status: string) => {
  const colors: Record<string, string> = {
    'completed': 'success',
    'processing': 'processing',
    'failed': 'error',
    'pending': 'warning'
  }
  return colors[status] || 'default'
}

onMounted(() => {
  // 获取最近任务列表
  recentTasks.value = store.tasks.slice(0, 5)
})
</script> 